{%- macro render_pai(pai) -%}
  {%- if pai == "back" -%}
    <svg class="tile">
      <use class="back" href="#tile"></use>
    </svg>
  {%- else -%}
    <svg class="tile">
      <use class="face" href="#pai-{{ pai | lower }}"></use>
    </svg>
  {%- endif -%}
{%- endmacro render_pai -%}

{%- macro render_action(action) -%}
  {%- if action[0].type == "none" -%}
    {% if lang == "en" %}Pass{% else %}スルー{% endif %}
  {%- elif action[0].type == "dahai" -%}
    {% if lang == "en" %}Discard{% else %}打{% endif %}
    {{ self::render_pai(pai=action[0].pai) }}
  {%- elif action[0].type == "reach" -%}
    {% if lang == "en" %}Discard{% else %}打{% endif %}
    {{ self::render_pai(pai=action[1].pai) }}
    {% if lang == "en" %}Riichi{% else %}リーチ{% endif %}
  {%- elif action[0].type == "hora" -%}
    {%- if action[0].target == action[0].actor -%}
      {% if lang == "en" %}Tsumo{% else %}ツモ{% endif %}
    {% else -%}
      {% if lang == "en" %}Ron{% else %}ロン{% endif %}
    {%- endif -%}
  {%- elif action[0].type == "chi" -%}
    {%- for pai in action[0].consumed -%}
      {{- self::render_pai(pai=pai) -}}
    {% endfor %}
    {% if lang == "en" %}Chii, cut{% else %}チー打{% endif %}
    {{ self::render_pai(pai=action[1].pai) }}
  {%- elif action[0].type == "pon" -%}
    {%- for pai in action[0].consumed -%}
      {{- self::render_pai(pai=pai) -}}
    {% endfor %}
    {% if lang == "en" %}Pon, cut{% else %}ポン打{% endif %}
    {{ self::render_pai(pai=action[1].pai) }}
  {%- elif action[0].type == "kakan" or action[0].type == "daiminkan" -%}
    {% if lang == "en" %}&Kan{% else %}カン{% endif %}
    {{ self::render_pai(pai=action[0].pai) }}
  {%- elif action[0].type == "ankan" -%}
    {% if lang == "en" %}Kan{%- else %}カン{% endif %}
    {{ self::render_pai(pai=action[0].consumed[0]) }}
  {%- elif action[0].type == "ryukyoku" -%}
    {% if lang == "en" %}Ryuukyoku{%- else %}流局{% endif %}
  {%- endif -%}
{%- endmacro render_action -%}

{%- macro render_actor(actor, target_actor) -%}
  {%- if (actor - target_actor + 4) % 4 == 1 -%}
    {% if lang == "en" %}Shimocha{% else %}下家{% endif %}
  {%- elif (actor - target_actor + 4) % 4 == 2 -%}
    {% if lang == "en" %}Toimen{% else %}対面{% endif %}
  {%- elif (actor - target_actor + 4) % 4 == 3 -%}
    {% if lang == "en" %}Kamicha{% else %}上家{% endif %}
  {%- else -%}
    {% if lang == "en" %}Self{% else %}自家{% endif %}
  {%- endif -%}
{%- endmacro -%}

{%- macro render_end_status(end_status, target_actor) -%}
  {%- if end_status.type == "hora" -%}
    {%- if end_status.target == end_status.actor -%}
      {% if lang == "en" %}Tsumo by&nbsp;{% else %}ツモ：{% endif %}
    {%- else -%}
      {% if lang == "en" %}Ron by&nbsp;{% else %}ロン：{% endif %}
    {%- endif -%}
    {{ self::render_actor(actor=end_status.actor, target_actor=target_actor) }}
    {{ end_status.deltas[end_status.actor] }}
  {%- else -%}
    {% if lang == "en" %}Ryuukyoku{% else %}流局{% endif %}
  {%- endif -%}
{%- endmacro render_end_status -%}

{%- macro render_tehai_state(entry, target_actor) -%}
  {%- set actor = (entry.actor - target_actor + 4) % 4 -%}
  <ul class="tehai-state">
    {%- for pai in entry.state.tehai -%}
      {%- if entry.state.tehai|length == loop.index -%}
        {%- if entry.actor == target_actor -%}
          <li class="tsumo" data-content="{% if lang == "en" %}Draw:{% else %}ツモ{% endif %} ">{{- self::render_pai(pai=pai) -}}</li>
        {%- else -%}
          <li>{{- self::render_pai(pai=pai) -}}</li>
          {%- set content = self::render_actor(actor=entry.actor, target_actor=target_actor) -%}
          {%- if entry.is_kakan -%}
            {%- if lang == "en" -%}
              {%- set content = content ~ " Kan " -%}
            {%- else -%}
              {%- set content = content ~ "カン " -%}
            {%- endif -%}
          {%- else -%}
            {%- if lang == "en" -%}
              {%- set content = content ~ " Cut " -%}
            {%- else -%}
              {%- set content = content ~ "打 " -%}
            {%- endif -%}
          {%- endif -%}
          <li class="tsumo" data-content="{{ content }}">{{- self::render_pai(pai=entry.pai) -}}</li>
        {%- endif -%}
      {%- else -%}
        <li>{{- self::render_pai(pai=pai) -}}</li>
      {%- endif -%}
    {%- endfor -%}
    {%- for fuuro in entry.state.fuuros|reverse -%}
      <li class="fuuro">{{- self::render_fuuro(fuuro=fuuro, target_actor=target_actor) -}}</li>
    {%- endfor -%}
  </ul>
{%- endmacro render_tehai_state -%}

{%- macro render_fuuro(fuuro, target_actor) -%}
  {%- if fuuro.type == "pon" or fuuro.type == "chi" -%}
    {{- self::render_pon_or_chi(fuuro=fuuro, target_actor=target_actor) -}}
  {%- elif fuuro.type == "ankan" -%}
    {{- self::render_ankan(fuuro=fuuro, target_actor=target_actor) -}}
  {%- elif fuuro.type == "kakan" -%}
    {{- self::render_kakan(fuuro=fuuro, target_actor=target_actor) -}}
  {%- elif fuuro.type == "daiminkan" -%}
    {{- self::render_daiminkan(fuuro=fuuro, target_actor=target_actor) -}}
  {%- endif -%}
{%- endmacro render_fuuro -%}

{%- macro render_pon_or_chi(fuuro, target_actor) -%}
  {%- set relative_actor = (fuuro.target - target_actor + 4) % 4 -%}
  <ul class="consumed">
    {%- if relative_actor == 1 -%} {# 下家 #}
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
      <li class="rotated">{{- self::render_pai(pai=fuuro.pai) -}}</li>
    {%- elif relative_actor == 2 -%} {# 対面 #}
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li class="rotated">{{- self::render_pai(pai=fuuro.pai) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
    {%- elif relative_actor == 3 -%} {# 上家 #}
      <li class="rotated">{{- self::render_pai(pai=fuuro.pai) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
    {%- endif -%}
  </ul>
{%- endmacro render_pon_or_chi -%}

{%- macro render_ankan(fuuro, target_actor) -%}
  <ul class="consumed">
    <li>{{ self::render_pai(pai="back") }}</li>
    <li>{{ self::render_pai(pai=fuuro.consumed.1) }}</li>
    <li>{{ self::render_pai(pai=fuuro.consumed.2) }}</li>
    <li>{{ self::render_pai(pai="back") }}</li>
  </ul>
{%- endmacro render_ankan -%}

{%- macro render_kakan(fuuro, target_actor) -%}
  {%- set relative_actor = (fuuro.previous_pon_target - target_actor + 4) % 4 -%}
  <ul class="consumed">
    {%- if relative_actor == 1 -%} {# 下家 #}
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
      <li class="rotated added">{{- self::render_pai(pai=fuuro.pai) -}}{{- self::render_pai(pai=fuuro.previous_pon_pai) -}}</li>
    {%- elif relative_actor == 2 -%} {# 対面 #}
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li class="rotated added">{{- self::render_pai(pai=fuuro.pai) -}}{{- self::render_pai(pai=fuuro.previous_pon_pai) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
    {%- elif relative_actor == 3 -%} {# 上家 #}
      <li class="rotated added">{{- self::render_pai(pai=fuuro.pai) -}}{{- self::render_pai(pai=fuuro.previous_pon_pai) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
    {%- endif -%}
  </ul>
{%- endmacro render_kakan -%}

{%- macro render_daiminkan(fuuro, target_actor) -%}
  {%- set relative_actor = (fuuro.target - target_actor + 4) % 4 -%}
  <ul class="consumed">
    {%- if relative_actor == 1 -%} {# 下家 #}
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.2) -}}</li>
      <li class="rotated">{{- self::render_pai(pai=fuuro.pai) -}}</li>
    {%- elif relative_actor == 2 -%} {# 対面 #}
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li class="rotated">{{- self::render_pai(pai=fuuro.pai) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.2) -}}</li>
    {%- elif relative_actor == 3 -%} {# 上家 #}
      <li class="rotated">{{- self::render_pai(pai=fuuro.pai) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.0) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.1) -}}</li>
      <li>{{- self::render_pai(pai=fuuro.consumed.2) -}}</li>
    {%- endif -%}
  </ul>
{%- endmacro render_daiminkan -%}
